<template>
  <div class="leave-note-box">
    <span>*</span>
    <span>请假事由</span>
    <span>
      <van-field
        v-model="message"
        rows="1"
        autosize
        maxlength="80"
        type="textarea"
        placeholder="请输入"
        @blur="onConfirm"
      />
    </span>
  </div>
</template>
<script>
export default {
  data() {
    return {
      message: '',
    }
  },
  methods: {
    onConfirm() {
      this.$emit('saveValue', this.message)
    },
  },
}
</script>
<script>
export default {
  data() {
    return {
      message: '',
    }
  },
}
</script>
<style lang="scss" scoped>
.leave-note-box {
  position: relative;
  height: 100px;
  margin-bottom: 5px;
  background: #FFFFFF;
  span {
    position: absolute;
    &:first-child {
      top: 10px;
      left: 20px;
      color: red;
      font-size: 13px;
    }
    &:nth-child(2) {
      top: 10px;
      left: 36px;
      font-size: 12px;
      font-family: PingFangSC-Regular, PingFang SC;
      font-weight: 400;
      color: #8c97b2;
    }
    &:nth-child(3) {
      left: 20px;
      bottom: 0px;
      width: calc(100% - 22px);
    }
  }
}
</style>